<?php get_instance()->view('common/header');?>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=Tx7kgtgc31DjU25cP2FU0bFOr01MzI86"></script>
<style>
    .content-btn-box,.content-box{margin-top:10px;}
    .container {
        width: 100%;
    }
    .add-tag-btn{line-height: 40px;}
    .option-item {
        margin-bottom: 5px;
        position: relative;
    }
    .del-tag-btn{font-size: 14px;line-height: 36px;display: block;margin-bottom: 4px;}
    .del-tag-btn a{color: red;}
    .add-img{margin-top: 15px;margin-right: 6px;}
    .radio-list{float: left;}
    .delete-btn{position: absolute;top: 0px;right: 5px;}
    .img-box .img{width: 200px;height: 130px}
    .webuploader-container > div:nth-child(2){width: 78px !important;height: 34px !important;}
    .img-box-pic:after{content: '';display: block;clear: both;}
    .img-del{float: left; position: relative;margin-right: 10px;margin-bottom: 5px;}
    .del-branch-btn{margin-top: 7px;float: left;}
    .add-branch{display: inline-block;margin-top: 34px;}
    #l-map{height:300px;width:100%;}
    .tangram-suggestion-main{z-index: 10050;}
    .address-tel>.form-group>.control-label{margin-top: -5px;}
</style>
<div class="page-container home">
    <?php get_instance()->view('common/sidebar');?>
    <div class="page-content-wrapper">
        <div class="page-content">
            <div class="row">
                <div class="col-md-12">
                    <!-- BEGIN PAGE TITLE & BREADCRUMB-->
                    <h3 class="page-title"> <?php echo $title;?></h3>
                    <ul class="page-breadcrumb breadcrumb">
                        <li class="btn-group"> <a class="btn default ml_5 return" href="<?php echo $backUrl;?>"><i class="fa fa-chevron-left"></i> 返回</a> </li>
                        <li><i class="fa fa-home"></i><a href="<?php echo getUrl('shop/government');?>">政府办事指南 </a><i class="fa fa-angle-right"></i></li>
                        <li><a href="<?php echo $backUrl?>">详情 </a><i class="fa fa-angle-right"></i></li>
                        <li><a href="javascript:void(0);"><?php echo $add ? '添加' : '编辑';?></a></li>
                    </ul>
                    <!-- END PAGE TITLE & BREADCRUMB-->
                </div>
            </div>
            <div class="row">
                <div class="col-md-12">
                    <!-- BEGIN VALIDATION STATES-->
                    <div class="portlet box">
                        <div class="portlet-body form">
                            <!-- BEGIN FORM-->
                            <form action="<?php echo getUrl('shop/government/saveDistrict'); ?>" class="form-horizontal" id="save-form" method="post">
                                <div class="modal-body">
                                    <div class="form-group">
                                        <label class="control-label col-md-2">区县名称<span class="required">*</span></label>
                                        <div class="col-md-10">
                                            <input type="text" name="district_name" class="form-control required" value="<?php echo !$add ? $info['district_name'] : ''?>"/>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="control-label col-md-2">类型<span class="required">*</span></label>
                                        <div class="col-md-5" style="margin-top: 6px;">
                                            <a href="javascript:void(0);" class="add-address-tel" type="1"><i class="fa fa-plus"></i> 添加县局</a>
                                        </div>
                                        <div class="col-md-5" style="margin-top: 6px;">
                                            <a href="javascript:void(0);" class="add-address-tel" type="2"><img src=""
                                                                                                                alt=""> 添加县所</a>
                                        </div>
                                    </div>
                                    <div class="address-tel">
                                        <?php if (!$add): foreach ($info['address'] as $k => $v): if ($v['type'] == '县局'){$type = 'bureau'; }else{$type = 'county'; }foreach ($v['address'] as $kk => $vv):?>
                                        <div class="form-group">
                                            <label class="control-label col-md-2"><?php echo $v['type']?>电话<span class="required">*</span><br/><br/>地址<span class="required">*</span></label>
                                            <div class="col-md-10 input-group district" style="padding-left: 15px;">
                                                <input class="form-control required address" name="<?php echo $type?>_address[]"  placeholder="请填写地址" value="<?php echo $vv['address']?>" type="tel" readonly>
                                                <input class="form-control required" name="<?php echo $type?>_tel[]" placeholder="请填写电话" type="tel" value="<?php echo $vv['tel']?>">
                                                <input type="hidden" class="form-control lat_lng" value="<?php echo isset($vv['lat']) ? $vv['lat'] : ''; echo isset($vv['lng']) ? ','.$vv['lng'] : '';?>" name="<?php echo $type?>_lat_lng[]">
                                                <span class="input-group-addon delete-six-btn"><a href="javascript:void(0);"><i class="fa fa-times"></i></a></span>
                                            </div>
                                        </div>
                                        <?php endforeach; endforeach; endif;?>
                                    </div>
                                </div>
                                <div class="form-actionsc fluid">
                                    <div class="col-md-offset-2 col-md-9" style="padding-left: 0;">
                                        <?php if (!$add):?>
                                            <input name="id" value="<?php echo $info['id'];?>" type="hidden">
                                        <?php endif;?>
                                        <input type="hidden" name="g_id" value="<?php echo !$add ? $info['government_id'] : $info['id']?>">
                                        <button class="btn green"><i class="fa fa-save"></i> 保存</button>
                                        <a class="btn default seach-btn" href="<?php echo $backUrl?>"><i class="fa fa-chevron-left"></i> 返回</a>
                                    </div>
                                    <script type="text/javascript">
                                        $(function(){
                                            var model = $('#six-modal');

                                            $('.add-six').live('click', function(){
                                                model.find('.modal-title').html('新增');
                                                model.find('.has-error').removeClass('has-error').find('.validate_message').remove();
                                                model.find('.show_message_error').remove();
                                                model.find('.modal-body').find('input').val('');
                                                model.find("[name='id']").val('');
                                                model.modal();
                                            });

                                            $(".delete-six").live('click',function () {
                                                var id = $(this).attr('data-id');
                                                l_blockUI();
                                                $.ajax('<?php echo getUrl('shop/government/deleteDistrict')?>', {
                                                    dataType:'json',
                                                    type:'post',
                                                    data:{id:id},
                                                    error:function(){
                                                        show_message({status:0, message:'请求超时'});
                                                        App.unblockUI();
                                                    },
                                                    timeout:60000,
                                                    success:function(data,textStatus,jqXHR){
                                                        show_message(data);
                                                        if(data.status == 1){
                                                            getDistrictList();
                                                        }
                                                        App.unblockUI();
                                                    }
                                                });
                                                return false;
                                            });

                                            $.e_validate.init('#save-form', {});

                                            /**
                                             * 添加地址&电话
                                             */
                                            $(".add-address-tel").live('click',function () {
                                                var len = $(".address-tel").find('.form-group').length;
                                                if (len > 0) {
                                                    var gr = $(".address-tel").find('.form-group').eq(len - 1);
                                                    var address = gr.find('input').eq(0).val();
                                                    var tel = gr.find('input').eq(1).val();
                                                    if (!address.length || !tel.length) {
                                                        show_message({
                                                            error: 0,
                                                            message: '请完成上一个信息的填写'
                                                        });
                                                        return false;
                                                    }
                                                }
                                                var type = $(this).attr('type');
                                                var addressName,telName,name,lName;
                                                if (type == 1){
                                                    addressName = 'bureau_address[]';
                                                    telName = 'bureau_tel[]';
                                                    lName = 'bureau_lat_lng[]';
                                                    name = '县局';
                                                }else{
                                                    addressName = 'county_address[]';
                                                    telName = 'county_tel[]';
                                                    lName = 'county_lat_lng[]';
                                                    name = '县所';
                                                }
                                                var html = '<div class="form-group">' +
                                                    '<label class="control-label col-md-2">'+name+'地址<span class="required">*</span><br/><br/>电话<span class="required">*</span></label>' +
                                                    '<div class="col-md-10 input-group district" style="padding-left: 15px;">' +
                                                    '<input class="form-control required address" name="'+addressName+'"  placeholder="请填写地址" type="tel" readonly>' +
                                                    '<input class="form-control required" name="'+telName+'" placeholder="请填写电话" type="tel">' +
                                                    '<input type="hidden" class="form-control lat_lng"  name="'+lName+'">'+
                                                    '<span class="input-group-addon delete-six-btn"><a href="javascript:void(0);"><i class="fa fa-times"></i></a></span>' +
                                                    '</div></div>';
                                                $(".address-tel").append(html)
                                            });

                                            /**
                                             * 删除
                                             */
                                            $(".delete-six-btn").live('click',function () {
                                                $(this).parents('.form-group').remove();
                                            });
                                        });
                                    </script>
                                </div>
                            </form>
                        </div>
                    </div>
                    <!-- END VALIDATION STATES-->
                </div>
                <!-- END PAGE CONTENT-->
            </div>
        </div>
    </div>
</div>
<div id="save-modal" class="modal fade modal_small" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true"></button>
                <h4 class="modal-title">地址</h4>
            </div>
                <div class="modal-body">
                    <div class="form-group">
                        <label class="control-label col-md-2">地址<span class="required">*</span></label>
                        <div class="col-md-9">
                            <input type="text" id="suggestId" size="20" class="form-control required" placeholder="请输入地址"/>
                        </div>
                        <input type="hidden" id="addr"/>
                        <input type="hidden" id="lat"/>
                        <input type="hidden" id="lng"/>
                    </div>
                </div>
            <div style="position: relative;">
                <img style="position: absolute; left: 50%;top: 50%;z-index: 999;" src="<?php echo $this->staticUrl;?>img/dw.png" alt="">
                <div id="l-map"></div>
            </div>
            <div id="searchResultPanel" style="border:1px solid #C0C0C0;width:150px;height:auto; display:none;"></div>
            <script type="text/javascript">
                // 百度地图API功能
                function G(id) {
                    return document.getElementById(id);
                }

                var map = new BMap.Map("l-map");
                map.centerAndZoom("重庆",12);                   // 初始化地图,设置城市和地图级别。

                var ac = new BMap.Autocomplete(    //建立一个自动完成的对象
                    {"input" : "suggestId"
                        ,"location" : map
                    });
                map.enableScrollWheelZoom(true); // 缩放地图

                // 中心位置移动
                map.addEventListener("dragend", function(){
                    var center = map.getCenter();
                    var geoc = new BMap.Geocoder();
                    geoc.getLocation(center, function(rs){
                        if (rs.surroundingPois.length){
                            var title = rs.surroundingPois[0];
                            $("#addr").val(title.title);
                            $("#suggestId").val(title.title);
                            $("#lat").val(title.point.lat);
                            $("#lng").val(title.point.lng);
                        }else{
                            $("#addr").val(rs.address);
                            $("#suggestId").val(rs.address);
                            $("#lat").val(center.lat);
                            $("#lng").val(center.lng);
                        }
                    });
                });
                
                ac.addEventListener("onhighlight", function(e) {  //鼠标放在下拉列表上的事件
                    var str = "";
                    var _value = e.fromitem.value;
                    var value = "";
                    if (e.fromitem.index > -1) {
                        value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
                    }

                    str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value;

                    value = "";
                    if (e.toitem.index > -1) {
                        _value = e.toitem.value;
                        value = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
                    }
                    $("#addr").val(value);
                    str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value;
                    G("searchResultPanel").innerHTML = str;
                });

                var myValue;
                ac.addEventListener("onconfirm", function(e) {    //鼠标点击下拉列表后的事件
                    var _value = e.item.value;
                    myValue = _value.province +  _value.city +  _value.district +  _value.street +  _value.business;
                    G("searchResultPanel").innerHTML ="onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue;
                    setPlace();
                });

                function setPlace(){
                    map.clearOverlays();    //清除地图上所有覆盖物
                    function myFun(){
                        var pp = local.getResults().getPoi(0).point;    //获取第一个智能搜索的结果
                        $("#lat").val(pp.lat);
                        $("#lng").val(pp.lng);
                        map.centerAndZoom(pp, 18);
//                        map.addOverlay(new BMap.Marker(pp));    //添加标注
                    }
                    var local = new BMap.LocalSearch(map, { //智能搜索
                        onSearchComplete: myFun
                    });
                    local.search(myValue);
                }
            </script>

            <div class="modal-footer">
                <input type="hidden" name="id" value=""/>
                <button class="btn default" data-dismiss="modal" aria-hidden="true"><i class="fa fa-times"></i> 关闭</button>
                <button type="submit" class="btn green field-submit-btn"><i class="fa fa-save"></i> 保存</button>
                <script type="text/javascript">
                    $(function(){
                        var model = $('#save-modal');
                        var _this = '';
                        $('.address').live('click',function(){
                            model.find('.has-error').removeClass('has-error').find('.validate_message').remove();
                            model.find('.show_message_error').remove();
                            model.find("#addr").val('');
                            model.find("#lat").val('');
                            model.find("#lng").val('');
                            model.find("#suggestId").val('');
                            _this = $(this);
                            model.modal();
                        });

                        $(".field-submit-btn").click(function () {
                            var addr = $("#addr").val();
                            var lat = $("#lat").val();
                            var lng = $("#lng").val();
                            if(!addr.length || !lat.length || !lng.length){
                                show_modal_message({status:0, message:'请输入正确的地址'},model.find('.modal-body'));
                                return false;
                            }
                            _this.val(addr);
                            _this.parents('.district').find('.lat_lng').val(lat+','+lng);
                            $(this).prev().click();
                        });
                    });
                </script>
            </div>
        </div>
    </div>
</div>
</body>
</html>